<!-- 护理等级列表页 -->
<template>
  <div class="min-h serveGrade bg-wt">
  <SearchForm
  :searchData = "pagination"
  @handleClear = "handleClear"
  @handleSearch = "handleSearch"
  @handleReset = "handleReset">
  </SearchForm>

  <TableList
  :listData = "data"
  :pagination="pagination"
  :total="total"
  @handleBulid="handleBulid"
  @handleEdit="handleEdit"
  @onChange = "onChange"
  @handleClickDelete = "handleClickDelete"
  @handleForbidden="handleStart">
  </TableList>

  <DialogForm
  ref ="dialogForm"
  :visible = "formVisiable"
  :planData="planData"
  :title="title"
  :data="formData"
  @handleAdd = "handleAdd"
  @handleClose = "handleClose"
  @handleEditForm = "handleEditForm">
  </DialogForm>

  <OperateDialog
  :visible="delVisiable"
  :text = "text"
  @handleDelete = "handleDelete"
  @handleClose = "handleClose">
  </OperateDialog>
  </div>

  <Forbidden
  :text="text"
  :visible= "forbiddenVisiable"
  @handleClose = "handleClose"
  @handleSubmit ="handleForbidden">
  </Forbidden>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue';
import { MessagePlugin } from 'tdesign-vue-next'

import SearchForm from './components/SearchForm.vue';
import TableList from './components/TableList.vue';
import DialogForm from './components/DialogFrom.vue'
import OperateDialog from '@/components/OperateDialog/index.vue'
import Forbidden from '@/components/Forbidden/index.vue'



import { getLevelList, getnursAllPlanList, getLevelDetails, levelAdd,  levelUpdate, levelDelete, levelStatus } from '@/api/serve';

const data = ref([])
const total = ref (0)

const title = ref('')
const planData = ref([])
const dialogForm = ref()
const formData = ref()
const forbiddenVal = ref()

const text = ref('')
const delId = ref(0)
const formVisiable = ref(false)
const delVisiable = ref(false)
const forbiddenVisiable = ref(false)

// 分页参数
const pagination = ref<Object | any>({
  pageSize: 10,
  pageNum: 1 // 默认当前页
})
//分页查询
const getList = async () => {
  const result = await getLevelList(pagination.value)
  data.value = result.data.records
  total.value = Number(result.data.total)
}
onMounted(()=>{
  getList()
  getAllPlanList()
})
//导航栏改变时 重新查询
//打开页面时 获取所有的计划
const getAllPlanList = async ()=>{
  const res = await getnursAllPlanList()
  if(res.code == 200){
    planData.value = res.data
  }
}
//--------------------------搜索栏SearhForm部分---------------
const handleReset = () => {
  //重置页码 没写name和status 则默认为空
  pagination.value = {
    pageNum: 1,
    pageSize: 10
  }
  getList()
}

//搜索
const handleSearch = () => {
  //点击了搜索按钮之后，就需要重置页码
  pagination.value.pageNum = 1
  getList()
}

//清空
const handleClear = (val) => {
  if(val === 'name'){
    delete pagination.value.name
  }else{
    delete pagination.value.status
  }
  getList()
}
//-----------------------新增dialog功能---------------------
//打开弹窗
const handleBulid = ()=>{
  debugger
  title.value ='新增'
  formVisiable.value = true;
}

//关闭弹窗
const handleClose = ()=>{
  formVisiable.value = false // 关闭新增弹窗
  delVisiable.value = false //关闭删除弹窗
  forbiddenVisiable.value = false //关闭禁用弹窗
  getList()
}
//发送新增ajax
const handleAdd =async (val) =>{
  const res = await levelAdd(val)
  if(res.code == 200){
    debugger
    //成功
    MessagePlugin.success('新增护理项目成功')
    //关闭新增弹窗
    formVisiable.value = false
    //查询最新数据
    getList()
    //清空回显数据 这个是反过来调用实例 在代码块最后
    dialogForm.value.handleClear()
  }
}

//----------------------------编辑dialog功能------------------------------------
  //点击编辑，回显数据功能
  const handleEdit = (val) =>{
    debugger
    // 将弹窗的标题
    title.value = '编辑'
    // 获取详情
    getDetails(val.id)
    // 显示弹窗
    formVisiable.value = true
}

// 获取详情数据
const getDetails = async (id) => {
  debugger
  const res = await getLevelDetails(id) // 获取列表数据
    if (res.code === 200) {
      formData.value = res.data
    }
  }

// 回显后修改数据
const handleEditForm = async (val) => {
  debugger
  const res = await levelUpdate(val)
  if (res.code === 200) {
    MessagePlugin.success('编辑成功')
    getList()
    handleClose()
    dialogForm.value.handleClear()
  } else {
    MessagePlugin.error(res.msg)
  }
}

//---------------------------------------删除模块-------------------------
//打开删除弹框
const handleClickDelete =  (val)=>{
    debugger
    text.value = val.name
    delId.value = val.id
    delVisiable.value = true
}
//执行删除
const handleDelete = async ()=>{
    const res = await levelDelete(delId.value)
    if(res.code =200){
      MessagePlugin.success('删除成功')
      getList()
      handleClose()
    }else{
      MessagePlugin.error(res.msg)
    }
}
// -----------------禁用启用弹框功能---------------------
//点击禁用按钮 打开Forbidden弹窗
const handleStart = (val) =>{
    forbiddenVal.value =val
    text.value = val.name
    forbiddenVisiable.value = true
}

//处理提交修改禁用或者启用状态
const handleForbidden = async ()=>{
  forbiddenVal.value.status = forbiddenVal.value.status ? 0 :1
  console.log(forbiddenVal.value)
   const res = await levelStatus(forbiddenVal.value)
   if(res.code == 200){
    MessagePlugin.success('禁用成功')
    getList()
    handleClose()
   }

}
</script>